<template>
	<view class="content">
		<view class="nav">
			<view class="nav-left">{{name}}</view>
			<view class="nav-right"><text>错{{errors_num}}</text>共{{total}}题</view>
		</view>
		<view class="list" v-if="datas.length!=0">
			<view class="list_item" v-for="(item,index) in datas" :key="index">
				<view v-if="item.source_type==2" class="question_classify">自评</view>
				<view v-if="item.source_type==3" class="question_classify">同步</view>
				<view v-if="item.source_type==4" class="question_classify">趣练</view>
				<view v-if="item.source_type==5" class="question_classify">智测</view>
				<view class="title">
					<view v-html="item.question_title"></view>
				</view>
				<view class="time">
					<view class="left">
						{{item.update_time}}
						<text>错{{item.errors_num}}次</text>
					</view>
					<view class="right">
						<i class="iconfont iconyichu" @click="detele(item.intelligent_id,index)"></i><text @tap="detail(item.intelligent_id)">详情</text>
					</view>
				</view>
			</view>
		</view>
		<uni-load-more v-if="datas.length>4"  :status="status" :content-text="contentText" />
	</view>
</template>

<script>
	import util from '../../common/util.js';
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	export default{
		data() {
			return {
				status: 'more',
				reload: true,
				contentText: {
					contentdown: '上拉加载更多',
					contentrefresh: '加载中',
					contentnomore: '没有更多',
					contentnot: "没数据"
				},
				page: 1,
				datas: [],
				name: '',
				fname: '',
				zid: '',
				errors_num: '',
				total: '',
				groupid: '',
				student_id: ''
			}
		},
		components: {
			uniLoadMore
		},
		onPullDownRefresh() {
			this.reload = true;
			this.page = 1;
			this.last_id = '';
			this.getlist();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom() {
			this.status = 'loading';
			this.page = this.page+1;
			var _this = this;
			setTimeout(function(){
				_this.getlist();
			},500);
		},
		onLoad(e) {
			this.name = e.name;
			this.fname = e.fname;
			this.zid = e.zid;
			this.errors_num = e.errors_num;
			this.total = e.total;
			this.student_id = e.student_id;
			this.groupid = e.groupid;
			uni.setNavigationBarTitle({
				title: this.fname
			})
			this.getlist();
		},
		methods:{
			getlist:function(){
				var data = {
					page: this.page,
					pagesize: 5,
					lists_type: 1,
					state: 1,
					zid: this.zid,
					student_id: this.student_id
				};
				// if(this.groupid != '') {
				// 	data.lists_type = 2;
				// 	data.groupid = this.groupid;
				// }
				this.$zapi.apiPost('user/intelligent.users/intelligentLists',data).then(res=>{
					if(res.data.code == 200){
						var data = res.data.data.data;
						var question_ids_string = res.data.data.question_ids_string;
						this.loaddata(data,question_ids_string);
					}else{
						if(this.reload){
							this.datas = [];
						}else{
							this.status='noMore';
						}
					}
				});
			},
			loaddata: function(list,question_ids_string) {
				// console.log(list);
				this.$zapi.apiPost('user/question.Lists/questionList',{question_id:question_ids_string,is_get_answer:2,is_out_html:1}).then(res=>{
					if(res.data.code==200){
						var dataList = res.data.data.data;
						util.latex_reques(dataList,'question_title');//解析 试题标题 latex 公式转换
						util.latex_reques(dataList,'question_analysis');//解析 试题解析 latex 公式转换
						util.latex_answer(dataList,'answer_list');//解析答案选项 latex 公式转换
						for(let i=0;i<dataList.length;i++){
							var arr=[]; 
							for(let j=0;j<list.length;j++){
								if(dataList[i].question_id==list[j].question_id){
									var obj={};
									dataList[i].is_favorite=list[j].is_favorite;
									obj.user_text_answer=list[j].user_text_answer;
									obj.question_answer_id=list[j].question_answer_id;
									arr.push(obj);
								}
							}
							dataList[i].interest_lists_log = arr;
						}
						
						var da = util.getAnalysis(dataList);
						this.datas = this.reload ? da : this.datas.concat(da);
						for (let i = 0; i < this.datas.length; i++) {
							for(let j = 0; j < list.length; j++){
								if(this.datas[i].question_id == list[j].question_id){
									this.datas[i].source_type = list[j].source_type;
									var time = list[j].update_time;
									this.datas[i].update_time = util.getBriefTime(time);
									this.datas[i].errors_num = list[j].errors_num;
									this.datas[i].intelligent_id = list[j].intelligent_id;
								}
							}
						}
						this.reload = false;
						this.status = 'more';
					}
				});  
			},
			detail(intelligent_id) {
				uni.navigateTo({
					// url: 'notes-detail?intelligent_id='+intelligent_id + '&groupid=' + this.groupid
					url: 'notes-detail?intelligent_id='+intelligent_id + '&student_id=' + this.student_id
				})
			},
			detele(intelligent_id, index){
				var _this = this;
				uni.showModal({
					content: '移除后将无法恢复，确定要移除错题吗？',
					confirmColor: '#FF9900',
					success:function(s) {
						if (s.confirm) {
							_this.$zapi.apiPost('user/intelligent.users/IntelligentRemove',{intelligent_id:intelligent_id}).then(res => {
								uni.showToast({
									title: res.data.msg,
									icon: 'none'
								})
								// TODO: 这里暂时不需要
								// this.getlist();
								// 将当前这条从数组中去除
								_this.datas.splice(index, 1)
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #FAFAFA;
	}
	.content {
		width: 100%;
		height: 100%;
		position: absolute;
	}

	/**
	 * 选项卡
	 */
	.nav {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 88upx;
		line-height: 88upx;
		background-color: #FFFFFF;
		position: fixed;
		width: 100%;
	}
	.nav-left{
		margin-left: 30upx;
	}
	.nav-right{
		margin-right: 30upx;
		color: #CCCCCC;
	}
	.nav-right text{
		color: #333333;
		margin-right: 8upx;
	}
	/* 列表 */
	.list{
		width: 100%;
		z-index: 1;
		margin-top: 100upx;
	}
	.list_item{
		background-color: #FFFFFF;
		margin-top: 12upx;
		margin-bottom: 10upx;
	}
	.question_classify{
		background: #00D5A2; 
		color: #fff; 
		text-align: center; 
		border-radius: 0px 0px 6px 6px; 
		width: 62upx; 
		height: 32upx;
		line-height: 32upx;
		margin-left: 30upx;
		font-size: 26upx;
	}
	.title{
		color: #333333;
		font-size: 36upx;
		padding: 20upx 30upx;
	}
	.time{
		margin: 0 30upx;
		display: flex;
		justify-content: space-between;
		padding-bottom: 20upx;
	}
	.left{
		color: #999999;
		font-size: 30upx;
	}
	.time text{
		margin-left: 20upx;
	}
	.iconyichu{
		color: #FF9900;
		margin-right: 20upx;
		font-size: 40upx;
		line-height: 1.5;
	}
	.right{
		color: #FF9900;
		font-size: 30upx;
		display: flex;
	}
</style>
